$m(function (args) {
    var $this = this.element;
    $('#container').tabs({fit: true});
    var $layoutDyqq = $this.find("#tempo-dyqq");
    var $dyqqListTable = $this.find("#dyqq-chart-list-table");
    var $dyqqTimeTable = $this.find("#dyqq-chart-time-table");
    var serviceid = args.id;
    var $dyqq_chart_cricle = $this.find("#dyqq-chart-circle");
    var $dyqq_chart_line = $this.find("#dyqq-chart-line");

    var $layoutYxqq = $this.find("#tempo-yxqq");
    var $yxqqgrid = $layoutYxqq.find("#yxqq-table")

    var $layouthdgl = $this.find("#tempo-hdgl");
    var $hdglgrid = $layouthdgl.find("#hdgl-table");

    //判断是否为流服务
    var isStream = window.monitor.serviceType == "stream";

    var init = function () {
        //判断是否被灰度发布
        renderJkdy.renderGetGraySync();
        //调用情况的渲染和绑定事件
        renderDyqk.renderLayout();
        renderDyqk.renderQuery();
        renderDyqk.renderDyqqTable();
        renderDyqk.renderDyqqChart();
        if (isStream) {
            //流服务不显示证书名称
            renderDyqk.renderHideClientSelect();
        } else {
            //同时渲染调用情况和运行情况的下拉框
            renderDyqk.renderSelect();
        }
        //运行情况的渲染和绑定事件
        renderYxqK.renderLayout();
        renderYxqK.renderQuery();
        renderYxqK.renderGrid();
        //hdgl的渲染和绑定事件
        renderhdgl.renderLayoutGray();
        renderhdgl.renderGridGray();
        $(".qtn-style").css("padding", "5px 2px!important");
        if (isStream) {
            //流程服务不显示调用系统列表和调用响应时间表 (Top10)
            renderStream.renderHideTable();
        }
    }

    /**
     * 运行情况的渲染和绑定事件
     */
    var renderYxqK = {

        renderLayout: function () {
            $layoutYxqq.find("#yxqq-table-container").width($('#container').width() - 40);
            $layoutYxqq.find("#yxqq-table-container1").width($('#container').width() - 40);
        },

        renderQuery: function () {
            var form = $layoutYxqq.find('#queryYxqqForm');
            if ($('#container').width() < 1000) {
                form.find('[name="starttime"]').width('80px');
                form.find('[name="endtime"]').width('80px');
                form.find('[name="result"]').attr('ui-options', 'width: 90');
                form.find('[name=client]').attr('ui-options', 'width: 90');
            } else {
                form.width('1050px');
            }
            TempoUtils.parserUi(form, {});
            form.find('[name="starttime"]').datepicker({
                dateFormat: "yy-mm-dd",
                yearRange: "c-100:",
                //设置日期的最大时间和最小时间
                minDate: DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)),
                maxDate: DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)),
                changeYear: true,
                changeMonth: true,
                onClose: function (selectedDate) {
                    var d = $(this).datepicker('getDate');
                    if (d == null) {
                        return;
                    }
                    var d2 = new Date(d.getTime());
                    var d2str = d2.Format('yyyy-MM-dd');
                    form.find('[name="endtime"]').datepicker("option", "minDate", d2str);
                },
                onSelect: function (value) {
                },
                onChangeMonthYear: function (year, month, inst) {
                    var month = inst.selectedMonth + 1;
                    var day = inst.selectedDay;
                    var format = function (v) {
                        return String(v).length > 1 ? v : ('0' + v)
                    }
                    $(this).val(inst.selectedYear + '-' + format(month) + '-' + format(inst.selectedDay));
                    $.datepicker._hideDatepicker(this);
                }
            });
            form.find('[name="endtime"]').datepicker({
                dateFormat: "yy-mm-dd",
                yearRange: "c-100:",
                //设置日期的最大时间和最小时间
                minDate: DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)),
                maxDate: DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)),
                changeYear: true,
                changeMonth: true,
                onSelect: function (value) {
                },
                onClose: function (selectedDate) {
                    var d = $(this).datepicker('getDate');
                    if (d == null) {
                        return;
                    }
                    var d2 = new Date(d.getTime());
                    var d2str = d2.Format('yyyy-MM-dd');
                    form.find('[name="starttime"]').datepicker("option", "maxDate", d2str);
                },
                onChangeMonthYear: function (year, month, inst) {
                    var month = inst.selectedMonth + 1;
                    var day = inst.selectedDay;
                    var format = function (v) {
                        return String(v).length > 1 ? v : ('0' + v)
                    }
                    $(this).val(inst.selectedYear + '-' + format(month) + '-' + format(inst.selectedDay));
                    $.datepicker._hideDatepicker(this);
                }
            });
            form.find('.queryBtn').button({
                click: function () {
                    var client = form.find('[name="client"]').val();
                    var starttime = form.find('[name="starttime"]').datepicker('getDate');
                    var endtime = form.find('[name="endtime"]').datepicker('getDate');
                    var result = form.find('[name="result"]').val();
                    var data = {
                        client: client,
                        starttime: starttime ? DateUtils.formatDate(starttime, 'yyyy-MM-dd') : null,
                        endtime: endtime ? DateUtils.formatDate(endtime, 'yyyy-MM-dd') : null,
                        runresult: result
                    }
                    //重新加载表格
                    $yxqqgrid.datagrid('reloadGrid', data);
                    return false;
                }
            });
            form.find('.resetBtn').button({
                click: function () {
                    form[0].reset();
                    form.find('[name="endtime"]').datepicker("option", "minDate", DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)));
                    form.find('[name="starttime"]').datepicker("option", "maxDate", DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)));
                    form.find('[name="result"]').val('').selectmenu('refresh');
                    var data = {
                        client: null,
                        starttime: null,
                        endtime: null,
                        runresult: null
                    }
                    //重新加载表格
                    $yxqqgrid.datagrid('reloadGrid', data);
                    return false;
                }
            });
        },

        renderGrid: function () {
            $yxqqgrid.datagrid({
                datatype: "json",
                url: contextPath + '/api/ai/app/list-running?serviceid=' + serviceid,
                rownumbers: true,
                mtype: 'GET',
                width: $('#container').width() - 40,
                height: $('#container').height() - 190,
                shrinkToFit: true,
                viewrecords: true,
                striped: true,
                pagination: true,
                colNames: ['id',
                    TempoUtils.locale("mine.diaoyongxitong"),
                    TempoUtils.locale("aiview.diaoyongsj"),
                    TempoUtils.locale("aiview.zxhs"),
                    TempoUtils.locale("aiview.dyjg"),
                    TempoUtils.locale("aiview.xxrz")
                ],
                colModel: [{
                    name: 'id',
                    index: 'id',
                    hidden: true,
                    sortable: false
                }, {
                    name: 'clientName',
                    index: 'clientName',
                    width: 80,
                    //流服务不显示证书名称，修改50697bug
                    hidden: isStream,
                    sortable: false,
                    formatter: function (obj) {
                        return !!obj ? obj : '无';
                    }
                }, {
                    name: 'runtime',
                    index: 'runtime',
                    width: 80,
                    sortable: false,
                    formatter: function (obj) {
                        return DateUtils.formatDateTime(obj);
                    }
                }, {
                    name: 'spendtime',
                    index: 'spendtime',
                    sortable: false,
                    width: 120,
                    formatter: function (obj) {
                        var v = obj / 1000;
                        return v.toFixed(2) + "s";
                    }
                }, {
                    name: 'runResult',
                    index: 'runResult',
                    sortable: false,
                    width: 120,
                    formatter: function (obj, grid, rows, state) {
                        var success = rows.runresult;

                        if (success == "1") {
                            return TempoUtils.locale("mine.chenggong");
                        }
                        if (success == "0") {
                            return TempoUtils.locale("mine.shibai");
                        }
                        return TempoUtils.locale("mine.zhengzaizhixing");
                    },
                    width: 80
                }, {
                    name: 'concrete',
                    index: 'concrete',
                    sortable: false,
                    width: 120,
                    sortable: false,
                    buttons: [{
                        id: "down",
                        icon: "ui-icon tempo-ui-icon tempo-ui-icon-download",
                        title: TempoUtils.locale("mine.xiazai"),
                        click: function (e, dt) {
                            //异步服务环境资源配置弹框
                            var dateStr = new Date(DateUtils.formatDateTime(dt.rowData.runtime).replace(/-/g, "/")).Format("yyyy-MM-dd");
                            downloadLog({
                                url: contextPath + "/api/ai/app/service/down-log",
                                data: {
                                    id: serviceid,
                                    logId: dt.rowData.id,
                                    fileName: (dt.rowData.clientName || TempoMineUtils.decodeHTML(window.monitor.serviceName)) + dateStr,
                                }
                            });
                        }
                    }]
                }
                ]
            });
        }
    }

    var renderhdgl = {
        renderLayoutGray: function () {
            $layouthdgl.find("#hdgl-table-container").width($('#container').width() - 40);
            $layouthdgl.find("#gbox_hdgl-table").css("margin-left", "20px");
            $layouthdgl.find("#gview_hdgl-table").height($('#container').height() - 88);
            $layouthdgl.find("#gbox_hdgl-table").height($('#container').height() - 60);
            $("#gbox_hdgl-table").find(".ui-jqgrid-bdiv").height($('#container').height() - 150);
        },
        renderGridGray: function () {
            $hdglgrid.datagrid({
                datatype: "json",
                url: contextPath + '/api/ai/mine/gray/get-grays-sync?serviceid=' + serviceid,
                rownumbers: true,
                mtype: 'GET',
                width: $('#container').width() - 40,
                height: $('#container').height() - 190,
                shrinkToFit: true,
                viewrecords: true,
                striped: true,
                pagination: true,
                colNames: ['ID',
                    "灰度服务",
                    TempoUtils.locale("mine.service-status")
                ],
                colModel: [{
                    name: 'ID',
                    index: 'ID',
                    hidden: true,
                    sortable: false
                }, {
                    name: 'NAME',
                    index: 'NAME',
                    width: 80,
                    sortable: false,
                    formatter: function (obj) {
                        return TempoMineUtils.encodeHTML(obj);
                    },
                }, {
                    name: 'STATUS',
                    index: 'STATUS',
                    sortable: false,
                    width: 120,
                    formatter: function (obj, grid, rows, state) {
                        var success = rows.STATUS;
                        if (success == "1") {
                            return TempoUtils.locale("mine.retry_enable");
                        }
                        if (success == "0") {
                            return TempoUtils.locale("mine.jinyong");
                        }
                    },
                    width: 80
                }
                ]
            });
        }
    }

    /**
     * 下载服务运行的详细日志
     * 由于TempoUtils.download(options)方法中对get请求的参数没有进行16进制编码。谷歌，火狐会默认进行编码，而ie11则不进行编码，
     * 当参数中有中文时，ie11报错
     */
    var downloadLog = function (options) {
        for (var key in options.data) {
            options.data[key] = encodeURI(options.data[key]);
        }
        TempoUtils.download(options);
    };

    /**
     * 调用情况的渲染和绑定事件
     */
    var renderDyqk = {

        renderLayout: function () {
            var lc = $layoutDyqq.find(".layout-center");
            if (args.ht) {
                lc.height(args.ht - 105);
            } else {
                lc.height(window.innerHeight - lc.offset().top - 35);
            }
        },

        /**
         * 调用情况的页签渲染
         */
        renderQuery: function () {
            funList.initQuery();
        },

        /**
         * 渲染调用情况的绘图
         */
        renderDyqqChart: function () {
            funList.renderDyqqCircleChart();
            //默认渲染近半年的折线图
            funList.evtLoadLineChart("1", true, "");
        },

        /**
         * 渲染调用情况的表格
         */
        renderDyqqTable: function () {
            funList.initDyqqTable();
        },

        renderSelect: function () {
            //渲染下拉框
            $.ajax({
                url: contextPath + '/api/ai/app/auth/list-clients-by-id?t=' + TempoUtils.uuid(),
                data: {
                    serviceid: serviceid
                },
                type: 'get',
                dataType: 'json',
                success: function (rs) {
                    if (rs.success == true) {
                        funList.renderSelect($this.find("#queryForm select[name=client]"), rs.data);
                        funList.renderSelect($layoutYxqq.find("select[name=client]"), rs.data);
                    }
                }
            });
        },

        /**
         * 初始化隐藏证书名称
         */
        renderHideClientSelect: function () {
            //调用情况的证书名称
            var dyqkClient = $this.find('#queryForm').find('select[name="client"]');
            dyqkClient.parent().hide();
            dyqkClient.parent().prev().hide();
            //运行情况的证书名称
            var yxqkClient = $layoutYxqq.find("select[name=client]");
            yxqkClient.parent().hide();
            yxqkClient.parent().prev().hide();
        }
    }

    var funList = {
        evtLoadLineChart: function (dateType, tag, client) {
            var data = {serviceid: serviceid, datetype: dateType, client: client}
            if (!client || client == "") {
                data = {serviceid: serviceid, datetype: dateType}
            }
            $.ajax({
                url: contextPath + '/api/ai/app/statistics/count-by-date?t=' + TempoUtils.uuid(),
                data: data,
                type: 'get',
                dataType: 'json',
                success: function (rs) {
                    if (rs.success == true) {
                        var data = rs.data;
                        var rq = [];
                        var cs = [];
                        data.forEach(function (v, i) {
                            rq.push(v.date1);
                            cs.push(v.times);
                        });
                        var options = funList.lineOptions(rq, cs);
                        funList.renderChart($dyqq_chart_line[0], options);
                        if (tag) {
                            funList.evtChartBar();//给折线图添加绑定事件
                        }
                    }
                }
            });
        },
        evtChartBar: function () {
            var visitToolBar = $("<div class='tempo-achieve-survey-buttonbar-div-class'/>").appendTo($dyqq_chart_line);
            $("<span class='tempo-achieve-survey-buttonbar-span-class '>" + TempoUtils.locale("runtime.lately_week") + "</span>").data("linkType", "4").appendTo(visitToolBar);
            $("<span class='tempo-achieve-survey-buttonbar-span-class'>" + TempoUtils.locale("runtime.lately_month") + "</span>").data("linkType", "3").appendTo(visitToolBar);
            $("<span class='tempo-achieve-survey-buttonbar-span-class'>" + TempoUtils.locale("runtime.lately_three_month") + "</span>").data("linkType", "2").appendTo(visitToolBar);
            $("<span class='tempo-achieve-survey-buttonbar-span-class tempo-achieve-survey-buttonbar-span-select-class'>" + TempoUtils.locale("runtime.lately_half_year") + "</span>").data("linkType", "1").appendTo(visitToolBar);
            visitToolBar.on("click", "span", function () {
                var type = $(this).data("linkType");
                visitToolBar.find('span').removeClass('tempo-achieve-survey-buttonbar-span-select-class');
                $(this).addClass('tempo-achieve-survey-buttonbar-span-select-class');
                var client = $('#tempo-dyqq #queryForm').find('[name="client"]').val();
                funList.evtLoadLineChart(type, null, client);
            });
        },
        renderChart: function (dom, options) {
            var chart = echarts.init(dom);
            chart.setOption(options);
            if (options.series[0].data.length == 0) {
                var dataNull = $("<div class='tempo-mid-data-null'> <span class='data_null_icon applied_data_null'></span> <br/><span class='applied_data_null'>" + TempoUtils.locale("aiview.canvas_data_null") + "</span></div>");
                $(dom).append(dataNull);
            } else {
                $(dom).find(".tempo-mid-data-null").remove();
            }
        },
        initQuery: function () {
            var form = $this.find('#queryForm');
            TempoUtils.parserUi(form, {});
            form.find('[name="starttime"]').datepicker({
                dateFormat: "yy-mm-dd",
                yearRange: "c-100:",
                //设置日期的最大时间和最小时间
                minDate: DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)),
                maxDate: DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)),
                changeYear: true,
                changeMonth: true,
                onClose: function (selectedDate) {
                    var d = $(this).datepicker('getDate');
                    if (d == null) {
                        return;
                    }
                    var d2 = new Date(d.getTime());
                    var d2str = d2.Format('yyyy-MM-dd');
                    form.find('[name="endtime"]').datepicker("option", "minDate", d2str);
                },
                onSelect: function (value) {
                },
                onChangeMonthYear: function (year, month, inst) {
                    var month = inst.selectedMonth + 1;
                    var day = inst.selectedDay;
                    var format = function (v) {
                        return String(v).length > 1 ? v : ('0' + v)
                    }
                    $(this).val(inst.selectedYear + '-' + format(month) + '-' + format(inst.selectedDay));
                    $.datepicker._hideDatepicker(this);
                }
            });
            form.find('[name="endtime"]').datepicker({
                dateFormat: "yy-mm-dd",
                yearRange: "c-100:",
                //设置日期的最大时间和最小时间
                minDate: DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)),
                maxDate: DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)),
                changeYear: true,
                changeMonth: true,
                onSelect: function (value) {
                },
                onClose: function (selectedDate) {
                    var d = $(this).datepicker('getDate');
                    if (d == null) {
                        return;
                    }
                    var d2 = new Date(d.getTime());
                    var d2str = d2.Format('yyyy-MM-dd');
                    form.find('[name="starttime"]').datepicker("option", "maxDate", d2str);
                },
                onChangeMonthYear: function (year, month, inst) {
                    var month = inst.selectedMonth + 1;
                    var day = inst.selectedDay;
                    var format = function (v) {
                        return String(v).length > 1 ? v : ('0' + v)
                    }
                    $(this).val(inst.selectedYear + '-' + format(month) + '-' + format(inst.selectedDay));
                    $.datepicker._hideDatepicker(this);
                }
            });
            form.find('.queryBtn').button({
                click: function () {
                    var client = form.find('[name="client"]').val();
                    var starttime = form.find('[name="starttime"]').datepicker('getDate');
                    var endtime = form.find('[name="endtime"]').datepicker('getDate');
                    var data = {
                        client: client,
                        starttime: starttime ? DateUtils.formatDate(starttime, 'yyyy-MM-dd') : null,
                        endtime: endtime ? DateUtils.formatDate(endtime, 'yyyy-MM-dd') : null,
                        serviceid: serviceid
                    }
                    funList.renderDyqqCircleChart(data);//点击查询后渲染饼图
                    funList.initDyqqTable(data, true);//点击查询后渲染表格
                    funList.evtLoadLineChart("1", true, client);
                    return false;
                }
            });
            form.find('.resetBtn').button({
                click: function () {
                    form[0].reset();
                    form.find('[name="endtime"]').datepicker("option", "minDate", DateUtils.formatDate(new Date(new Date().getFullYear() - 100, 0, 1)));
                    form.find('[name="starttime"]').datepicker("option", "maxDate", DateUtils.formatDate(new Date(new Date().getFullYear() + 1, 0, 1)));
                    form.find('[name="result"]').val('').selectmenu('refresh');
                    return false;
                }
            });

        },
        initDyqqTable: function (queryData, queryTag) {
            var colName_list = ['ID', TempoUtils.locale("mine.diaoyongxitong"), TempoUtils.locale("aiview.app_call_times"), TempoUtils.locale("aiview.cgl")];
            var colModel_list = [{name: 'id', sortable: false, hidden: true}, {
                name: 'name',
                sortable: false
            }, {name: 'times', sortable: true},
                {
                    name: 'sucper', sortable: true, formatter: function (obj) {
                        return (obj * 100).toFixed(2) + "%"

                    }
                }];
            var colName_time = ['ID', TempoUtils.locale("mine.diaoyongxitong"), TempoUtils.locale("aiview.xysj")];
            var colModel_time = [{name: 'id', sortable: false, hidden: true}, {name: 'name', sortable: false}, {
                name: 'respontime', sortable: true,
                formatter: function (obj) {
                    return ((obj - 0) / 1000).toFixed(2) + "s";
                }
            }];
            if (queryData == null) {
                queryData = {serviceid: serviceid};
            }
            $.ajax({
                url: contextPath + '/api/ai/app/response/top?t=' + TempoUtils.uuid(),
                data: queryData,
                type: 'get',
                dataType: 'json',
                success: function (rs) {
                    if (rs.success == true) {
                        var data = rs.data;
                        if (queryTag) {
                            $dyqqListTable.datagrid("clearGridData");
                            $dyqqTimeTable.datagrid("clearGridData");
                            $dyqqListTable.datagrid("addJSONData", data);
                            $dyqqTimeTable.datagrid("addJSONData", data);
                        } else {
                            funList.loadTable($dyqqListTable, colName_list, colModel_list, data.sort(function (a, b) {
                                return b.sucper - a.sucper
                            }));
                            funList.loadTable($dyqqTimeTable, colName_time, colModel_time, data.sort(function (a, b) {
                                return b.respontime - a.respontime
                            }).slice(0, 10));
                        }
                    }
                }
            });
        },
        loadTable: function (ele, colName, colModel, data) {
            ele.datagrid({
                datatype: "local",
                data: data,
                fit: true,
                rownumbers: true,
                shrinkToFit: true,
                viewrecords: true,
                striped: true,
                colNames: colName,
                colModel: colModel
            });
        },
        lineOptions: function (rq, cs) {
            return {
                "title": [{
                    "text": TempoUtils.locale("aiview.rdycsbhqs"),
                    "left": 0,
                    "top": 5,
                    "show": true,
                    "textStyle": {
                        "color": "#333333",
                        "fontSize": 14,
                        "fontWeight": "bold"
                    },
                    "padding": [0, 0, 50, 0]
                }
                ],
                "color": ["#67cde3"],
                "grid": [{
                    "top": 60,
                    "right": 25,
                    "show": true,
                    "left": 40,
                    "borderWidth": 0
                }
                ],
                "xAxis": [{
                    "boundaryGap": true,
                    "nameLocation": "middle",
                    "nameGap": 30,
                    "axisLabel": {
                        "interval": "auto",
                        "autoInterval": true
                    },
                    "splitLine": {
                        "show": false
                    },
                    "axisTick": {
                        "show": false
                    },
                    "splitArea": {
                        "show": false,
                    },
                    "axisLine": {
                        "show": false
                    },
                    "nameShow": false,
                    "data": rq,
                    /*"name" : TempoUtils.locale("runtime.date"),
                    "aliasName" : TempoUtils.locale("runtime.date")*/
                }
                ],
                "yAxis": [{
                    "position": "left",
                    "splitArea": {
                        "show": false,
                    },
                    "axisTick": {
                        "show": false
                    },
                    "splitLine": {
                        "show": true
                    },
                    "tempoLabelFmt": {
                        "fillzero": false,
                        "thousandsplitchar": true,
                        "fixnumber": 2,
                        "selfenable": false
                    },
                    "axisLabel": {
                        "show": true,
                    },
                    "axisLine": {
                        "show": false
                    },
                    "nameShow": false
                }
                ],
                "legend": [{
                    "show": false,
                    "top": "bottom",
                    "data": [TempoUtils.locale("aiview.calltimes")]
                }
                ],
                "tooltip": [{
                    "show": true
                }
                ],
                "dataZoom": [{
                    "type": "slider",
                    "show": false
                }
                ],
                "series": [{
                    "type": "line",
                    "yAxisIndex": 0,
                    "barMaxWidth": "100%",
                    "barGap": "30%",
                    "fid": TempoUtils.locale("aiview.calltimes"),
                    "name": TempoUtils.locale("aiview.calltimes"),
                    "data": cs,
                    "smooth": true
                }
                ]

            }
        },
        renderSelect: function (ele, data) {
            ele.empty();
            ele.append($("<option value=''>" + TempoUtils.locale("aiview.all") + "</option>"));
            data.forEach(function (v, i) {
                ele.append($("<option value=" + v.clientCode + ">" + v.clientName + "</option>"));
            });
            ele.attr('ui-role', 'selectmenu');
            TempoUtils.parserUi(ele.parent(), {});
        },
        renderDyqqCircleChart: function (queryData) {
            if (queryData == null) {
                queryData = {serviceid: serviceid};
            }
            $.ajax({
                url: contextPath + '/api/ai/app/statistics/get-running-summary?t=' + TempoUtils.uuid(),
                data: queryData,
                type: 'get',
                dataType: 'json',
                success: function (rs) {
                    if (rs.success == true) {
                        var arr = [];
                        if (rs.data.suc != 0) {
                            arr.push({value: rs.data.suc, name: TempoUtils.locale("aiview.cg")});
                        }
                        if (rs.data.fai != 0) {
                            arr.push({value: rs.data.fai, name: TempoUtils.locale("aiview.fail")});
                        }
                        if (rs.data.execing != 0) {
                            arr.push({value: rs.data.execing, name: TempoUtils.locale("aiview.execing")});
                        }
                        var data = {
                            "series": [{"center": ["50%", "50%"], "data": arr, "radius": "45%", "type": "pie"}],
                            "title": {
                                "text": TempoUtils.locale("aiview.fwdycglsbl"), "left": 0,
                                "top": 25,
                                "show": true,
                                "textStyle": {
                                    "color": "#333333",
                                    "fontSize": 14,
                                    "fontWeight": "bold"
                                }
                            }, "tooltip": {"formatter": "{b}：{c}({d}%)", "trigger": "item"}
                            , "itemStyle": {
                                "color": function (d) {
                                    if (d.data.name == TempoUtils.locale("aiview.cg")) {
                                        return "#0d9f41";
                                    } else if (d.data.name == TempoUtils.locale("aiview.fail")) {
                                        return "#c23531";
                                    } else {
                                        return "#61a0a8"
                                    }
                                }
                            }
                        };
                        funList.renderChart($dyqq_chart_cricle[0], data);
                    }
                }
            });
        }
    }

    /**
     * 接口调用初始化
     */
    var renderJkdy = {

        renderGetGraySync: function () {
            $.ajax({
                url: contextPath + '/api/ai/mine/gray/get-gray-sync',
                data: {
                    id: serviceid
                },
                type: 'POST',
                async: false,
                success: function (rs) {
                    if (rs.data && rs.data.length > 0) {
                        $('a[href="#tempo-hdgl"]').show();
                    }
                }
            });
        },
    }

    /**
     * 流程服务不显示调用系统列表和调用响应时间表 (Top10)
     */
    var renderStream = {

        renderHideTable: function () {
            //调用情况样式调整
            $layoutDyqq.find(".dyqq-chart-table-div").hide();
            //将hr标签移除
            $layoutDyqq.find(".dyqq-chart-bar").parent().find("hr").remove();
            //增加hr标签
            if ($layoutDyqq.find("hr").length == 0) {
                $('<hr style="margin: 0px 0px 25px 0px;border: 0px;border-bottom: 1px solid #ebedef;">').insertAfter($layoutDyqq.find(".layout-north"));
            }
            $layoutDyqq.find(".dyqq-chart-bar").parent().css("display", "flex").css("justify-content", "space-around");
            //日调用次数变化趋势样式
            $($layoutDyqq.find(".dyqq-chart-bar")[0]).css("width", "45%").css("border-right", "1px solid #EBEDEF").css("padding", "10px");
            //服务调用成功率/失败率样式
            $($layoutDyqq.find(".dyqq-chart-bar")[1]).css("width", "45%").css("margin-left", "-90px");
            $layoutDyqq.find("#dyqq-chart-line").css("width", "100%").css("border-right", "0px");
            $layoutDyqq.find("#dyqq-chart-circle").css("width", "100%").css("border-right", "0px").css("margin-top", "-10px");
            //调整调用日期位置
            $layoutDyqq.find(".layout-north").find("td[class='qtn-style']").prev().css("width", "325px");
            $layoutDyqq.find(".layout-north").find("td[class='qtn-style']").prev().prev().css("width", "60px");
            $layoutDyqq.find(".layout-center").css("overflow", "auto");

            //运行情况样式调整
            var qtnStyleDom = $layoutYxqq.find(".layout-north").find("td[class='qtn-style']");
            qtnStyleDom.prev().css("width", "325px");
            qtnStyleDom.prev().prev().css("width", "60px");
            qtnStyleDom.prev().prev().prev().css("width", "150px");
            qtnStyleDom.prev().prev().prev().prev().css("width", "60px");
        },
    }

    init();
});